<template>
	<text :style="{color:color,fontSize:font_size}">{{countdown|| ''}}</text>
</template>

<script>
	export default {
		name: "countDown",
		props: {
			start_time: { //开始时间
				type: Number

			},
			end_time: { //结束时间时间
				type: Number

			},
			color: { //字体颜色
				type: String,
				default: '#000'

			},
			font_size: { //字体大小
				type: String,
				default: '25rpx'

			}
		},
		mounted() {
			this.timer = setInterval(() => {
				this.showtime()
			}, 1000)
		},
		methods: {
			showtime() {
				var endtime = this.end_time //定义结束时间
				var lefttime = endtime - Math.round(new Date() / 1000), //距离结束时间的毫秒数
					leftd = Math.floor(lefttime / ( 60 * 60 * 24)), //计算天数
					lefth = Math.floor(lefttime / ( 60 * 60) % 24), //计算小时数
					leftm = Math.floor(lefttime / ( 60) % 60), //计算分钟数
					lefts = Math.floor(lefttime  % 60); //计算秒数
				this.countdown = leftd + "天" + this.addO(lefth) + ":" + this.addO(leftm) + ":" + this.addO(lefts); //返回倒计时的字符串
				this.day = leftd; //返回天 
				this.time = lefth; //返回时
				this.minute = leftm; //返回分
				this.second = lefts; //返回秒
			},
			addO(el){
				return el < 10 ? '0' + el : el
			}
		},
		data() {
			return {
				countdown: null,
				day: '',
				time: '',
				minute: '',
				second: '',
				timer: null //重复执行
			};

		}
	}
</script>

<style scoped lang="less">

</style>
